<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
	
<%@include file="/map/head.jsp" %>



<div id = "right">
<h1>路径规划</h1>
<input type="text" class="input-text" id="query1" name="query" placeholder="请输入起点"/>
<span>&nbsp;&nbsp;至&nbsp;&nbsp;</span>
<input type="text" class="input-text" id="query2" name="query" placeholder="请输入终点"/>

     <input type="button" id="button" onclick="walkquery();" value="步行搜索"/>&nbsp;&nbsp;&nbsp;&nbsp;
    <input type="button" id="button" onclick="drivequery();" value="驾车搜索"/>&nbsp;&nbsp;&nbsp;&nbsp;
    <input type="button" id="button" onclick="query();" value="公交搜索"/>&nbsp;&nbsp;&nbsp;&nbsp;
    <!-- xiashiditu -->
    <div id="map" style="height:90%;width:1000px;background-color: blue;"></div>
    
    <!-- 右边  区域显示结果 -->
    <div id="driving_way" style="position: fixed;
            top: 120px;
            right: 0px;
            width: 270px;
            height: 450px;
            background: #fff;
            box-shadow: 0 2px 6px 0 rgba(27, 142, 236, 0.5);
            border-radius: 7px;
			z-index: 99;
			padding: 10px;
			display:inline;">
		<select>
            <option value="0">推荐方案</option>
			<option value="1">最少时间</option>
			<option value="2">最少换乘</option>
			<option value="3">最少步行</option>
			<option value="4">不乘地铁</option>
            <option value='5'>优先地铁</option>
		</select>
        <button id="search" onclick="search()">查询</button>
        <p id="result" style="height: 400px;
            overflow-y: auto;"></p>
	</div>
    
    </div>
</section>

</body>

 <!-- 地图的js代码 -->
     
        <script type="text/javascript">
     //获取地图对象
     var map = new BMapGL.Map("map");
     //初始化
     var point = new BMapGL.Point(116.404, 39.915);//北京
     //添加鼠标  滚轮
     map.enableScrollWheelZoom();
     //初始化
     map.centerAndZoom(point, 13); 
     //定义搜索
     
     var walking = new BMapGL.WalkingRoute(map, {renderOptions:{map: map, autoViewport: true}});
     //驾车
     var driving = new BMapGL.DrivingRoute(map, {renderOptions:{map: map, autoViewport: true}});
     //公交查询的参数
     var routePolicy = [BMAP_TRANSIT_POLICY_RECOMMEND,BMAP_TRANSIT_POLICY_LEAST_TIME,BMAP_TRANSIT_POLICY_LEAST_TRANSFER,BMAP_TRANSIT_POLICY_LEAST_WALKING,BMAP_TRANSIT_POLICY_AVOID_SUBWAYS,BMAP_TRANSIT_POLICY_FIRST_SUBWAYS];
 	//公交查询
     var transit = new BMapGL.TransitRoute(map, {
		renderOptions: {map: map, panel: "result"},
        policy: 0,
});
     //鼠标
     //获取用户的输入信息； js
     function walkquery(){
    	 var query1 = document.getElementById("query1").value;
    	 var query2 = document.getElementById("query2").value;
    	 
    	 //  搜索
    	 walking.search(query1,query2);
    	 
     }
    
     //定义驾车的函数
     function drivequery(){
    	 //获取用户输入地点
    	 var query1 = document.getElementById("query1").value;
    	 var query2 = document.getElementById("query2").value;
    	 alert(query1+query2);
    	 //把用户输入地点----经纬度----Point
    	 //驾车搜索
    	 var point1 = new BMapGL.Point(116.404, 39.915);
    	 var point2 = new BMapGL.Point(116.504, 39.925);
    	 
    	 driving.search(point1,point2);
    	 
     }
     
     
     //公交查询  点击公交查询   公交查询才显示
     function query(){
    	 //显示公交查询的div
    	 //js获取div
    	 document.getElementById("#driving_way").style.display="inline";
    	 
     }
     
     
     //对查询按钮处理
     function search (){
    	// alert("你正在进行公交查询");
    	//获取用户输入地点
    	 var query1 = document.getElementById("query1").value;
    	 var query2 = document.getElementById("query2").value;
    	 
    	 //把用户输入地点----经纬度----Point
    	 //驾车搜索
    	 var point1 = new BMapGL.Point(116.404, 39.915);
    	 var point2 = new BMapGL.Point(116.504, 39.925);
    	 
    	// map.clearOverlays(); 
 		var i= $("#driving_way select").val();
 		
 		search(point1,point2,routePolicy[i]); 
 		function search(point1,point2,r){
 			transit.setPolicy(r);
 	        transit.search(point1,point2);
 		}
    	 
     }
     
     </script>


</html>